<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<head>

<link rel="stylesheet" href="css/carstyle.css" type="text/css" />
<script type="text/javascript" src="js1/jquery-1.8.0.js"> </script>



</head>

<jsp:include page="customerTop.jsp" />

<body class="carbody">
<center>
	<div class="cardiv_a"  align="left" >
		我的购物车
	</div>
	<div  class="cardiv_b">
		<div class="cardiv_c">
	       <table  class="cartab_a" width="100%" border="0" cellspacing="0" cellpadding="10">
             <tr height="25">
                 <td width="10%" colspan="2">购物车商品--现在购买</td>
                 <td width="10%" align="center">价格</td>
                 <td width="10%" align="center">数量</td>
             </tr>
            
             <tr>
               <td><a href="#"><img class="carimg_a" src="images1/clothtest.jpg"></a></td>
               <td width="70%" >
             	  <p>经典款式，时尚衬衣</p>
             	  <p  style="color:green">现在有货</p>
             	  <p>购买本商品，可以享受免费配送<p>
              	  <p><a href="#" target="_self">删除</a><p>
               
               </td>
               <td align="center" valign="top">
               	  <p style="color:red">￥ 232.30</p>
               </td>
               <td align="center" valign="top">
				  <p>
               	  		<input type="text" maxlength="4" size="3" id="gnum" onkeydown= "checkNum(event);" onchange="openUpdate()"/>
               	  </p>
               	  		<p style="display:none" id="updatediv"><a href="#">更新</a></p>
			   </td>
             </tr>
              <tr>
                <td colspan="4"><hr style="width:100%"></td>
            </tr>
            
               <tr>
               <td><a href="#"><img class="carimg_a" src="images1/clothtest.jpg"></a></td>
               <td width="70%" >
             	  <p>经典款式，时尚衬衣</p>
             	  <p  style="color:green">现在有货</p>
             	  <p>购买本商品，可以享受免费配送<p>
              	  <p><a href="#" target="_self">删除</a><p>
               
               </td>
               <td align="center" valign="top">
               	  <p style="color:red">￥ 232.30</p>
               </td>
               <td align="center" valign="top">
				  <p>
               	  		<input type="text" maxlength="4" size="3" id="gnum" onkeydown= "checkNum(event);" onchange="openUpdate()"/>
               	  </p>
               	  		<p style="display:none" id="updatediv"><a href="#">更新</a></p>
			   </td>
             </tr>
              <tr>
                <td colspan="4"><hr style="width:100%"></td>
            </tr>
               <tr>
               <td><a href="#"><img class="carimg_a" src="images1/clothtest.jpg"></a></td>
               <td width="70%" >
             	  <p>经典款式，时尚衬衣</p>
             	  <p  style="color:green">现在有货</p>
             	  <p>购买本商品，可以享受免费配送<p>
              	  <p><a href="#" target="_self">删除</a><p>
               
               </td>
               <td align="center" valign="top">
               	  <p style="color:red">￥ 232.30</p>
               </td>
               <td align="center" valign="top">
				  <p>
               	  		<input type="text" maxlength="4" size="3" id="gnum" onkeydown= "checkNum(event);" onchange="openUpdate()"/>
               	  </p>
               	  		<p style="display:none" id="updatediv"><a href="#">更新</a></p>
			   </td>
             </tr>
              <tr>
                <td colspan="4"><hr style="width:100%"></td>
            </tr>
         </table>
   	   </div>
   	   
   	  
   	  <!-- 左边的显示购物车的div -->
   	   <div class="cardiv_e" >
   	   		<table width="100%" height="100%"  border="0" align="center" cellspacing="0" cellpadding="0">
 				 <tr height="70px">
   					 <td align="center" width="20%" valign="middle"><img src="images1/carpro3.jpg"></td>
  					 <td valign="middle">
  					 	<p>你的订单可享受免费配送，如果其他要求请联系我们。</p>
  					 </td>
    				
  			    </tr>
                <tr>
                  <td colspan="2" align="center">
                  		<div  class="cardiv_f" >
                  			<span>小计商品(14)件<span style="color:red">￥ 755.00</span></span><br/>
                  			<span style="color:blue">继续添加</span>
                  		</div>
                  </td>    
               </tr>
  			   <tr>
    			  <td colspan="2" align="center"><img id="carimg_b"  onclick="showFloat()"  src="images1/carpro2.jpg"/></td>
               </tr>
            </table>
   	   		
   	   		
     </div>
   	   
   	   <script type="text/javaScript">
   	   	//不能输入字符的函数
		function checkNum(event){
			if(!-[1,]){                            //IE浏览器下的验证
  				var e = window.event;
  				var c=e.keyCode||e.charCode;
  				if(c>=48&&c<=57||c==8){
					return true;
					
				}else{
					event.returnValue=false;  //返回，数字没有输入
				}
  				
			}
			else{                                  //chrome和火狐下的验证
				var e = e=event? event:window.event; 
				var c=e.keyCode||e.charCode;
				if(c>=48&&c<=57||c==8){
					return true;
	
				}
				else{
					//alert("只能输入数字");
				
					event.preventDefault();   //让火狐保持默认
			
					event.returnValue=false;  //返回，数字没有输入
				
				
				}
			}
		}
		
		//显示更新的层
		function openUpdate(){
			document.getElementById("updatediv").style.display = "block";
		}
   	   	
   	   	
	   </script>  
	    <script type="text/javascript">
   //控制查看详情按钮的样式
   		$("#carimg_b").mouseover(function(event){
   			$(this).css("border","1px solid #6699ff");
   		});
   		$("#carimg_b").mouseout(function(event){
   			$(this).css("border","0px");
   		});
   		/*
   		$("#carimg_b").click(function(event){
   			location.href="goodDescribe.jsp";
   		});
   		*/
   		
   </script> 	   
   	   
   </div>	
</center>


<center>
	
	<form id="form1" method="post">
     <!--加一个半透明层--> 
    <div id="doing" style="filter:alpha(opacity=30);-moz-opacity:0.3;opacity:0.3;background-color:#000;width:100%;height:100%;z-index:1000;position: absolute;left:0;top:0;display:none;overflow: hidden;"> 
    </div>    
    <!--加一个登录层--> 
    <div id="divLogin" style="border:solid 10px #66ccff;background:#fff;padding:10px;width:780px;z-index:1001; position: absolute; display:none;top:50%; left:50%;margin:-200px 0 0 -400px;"> 
            <div style="padding:3px 15px 3px 15px;text-align:left;vertical-align:middle;" > 
                 <div> 
                     商品发送信息--<label ID="lbToWho"  ></label> 显示
                     <table border="0"> 
                     <tr >
                     	<td width="25%">颜色</td>
                     	<td width="25%">尺码</td>
                     	<td width="25%"></td>
                     	<td width="25%">小计</td>
                     </tr>
                      <tr>
                    	 <td width="25%"><span style="color:red">红色</span></td>
                     	<td width="25%"><span style="color:red">L</span></td>
                     	<td width="25%"></td>
                     	<td width="25%"><span style="color:red">￥ 455.00</span></td>
                     </tr>
                     </table>
                    <br />
                    <br />
                    用户信息：
                  <input type="text" ID="TxtTitle"  Width="349px" value="李先生 13467892342" > 
                </div> 
                <br />
                <div> 
                    地址：
                  <textarea ID="TxtContent"   rows="5" 
                         cols="30">湖南省株洲市 天元区  湖南工业大学</textarea>
                </div> 
                <br/> 
                <div> &nbsp; &nbsp; 
                    <input type="submit" ID="BtnCommite"  value="确定下订" 
                        onclick="BtnCommite_Click"/>&nbsp; 
                    <input id="BttCancel" type="button" value="取消" onclick="ShowNo()" /> 
                </div> 
            </div> 
      </div>
     
    </form>
    <br><br>
    
  
      <br>
   
   
    <script type="text/javascript" language="JavaScript"> 
        function ShowNo()                        //隐藏两个层 
        { 
            document.getElementById("doing").style.display="none"; 
            document.getElementById("divLogin").style.display="none"; 
        } 
        function m(id)        
        { 
            return (document.getElementById) ? document.getElementById(id) : document.all[id] ; 
        } 
        function showFloat()                    //根据屏幕的大小显示两个层 
        { 
            var range = getRange(); 
            m('doing').style.width = range.width + "px"; 
            m('doing').style.height = range.height + "px"; 
            m('doing').style.display = "block"; 
            document.getElementById("divLogin").style.display=""; 
        } 
        function getRange()                      //得到屏幕的大小 
        { 
              var top    = document.body.scrollTop; 
              var left    = document.body.scrollLeft; 
              var height = document.body.clientHeight; 
              var width = document.body.clientWidth;
              if (top==0 && left==0 && height==0 && width==0) 
              { 
                top    = document.documentElement.scrollTop; 
                left    = document.documentElement.scrollLeft; 
                height = document.documentElement.clientHeight; 
                width = document.documentElement.clientWidth; 
              } 
              return {top:top ,left:left ,height:height ,width:width } ; 
        } 
        
        function show(cur,which){
              
                if(which==1)
                {
                document.getElementById("p1").style.visibility="visible";
                document.getElementById("p2").style.visibility="visible";
                document.getElementById("p3").style.visibility="visible";
                
                }else{
                document.getElementById("p1").style.visibility="hidden";
                document.getElementById("p2").style.visibility="hidden";
                document.getElementById("p3").style.visibility="hidden";
                //document.getElementById("p").p1.style.visibility="hidden";; 
                }
                
               
        }
        
        function show2(cur,which){
              
             
               
                var d = m(cur);
                
      }
      
      
     
        
    </script>
    

</center>


</body>